<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>数据字典管理</title>
    <link rel="stylesheet" href="../../res/layui/css/layui.css" media="all">
    <script type="text/javascript" src="../../res/js/jquery-3.1.1.min.js"></script>
    <script src="../../res/layui/layui.js"></script>
    <style type="text/css">
        body {
            margin: 0 auto;
            width: 100%;
            height: 100%;
        }
        .demoTable {
            width: 99%;
            height: 50px;
            margin: 0px auto;
            line-height: 50px;
        }

        #demo{
            width: 800px;

        }
    </style>
</head>
<body>
    <script type="text/html" id="toolbarDemo">
        <div class="demoTable">
            <div class="layui-inline">
                <input class="layui-input" name="dname" id="dname" placeholder="请输入字典名称" autocomplete="off">
            </div>
            <div class="layui-inline">
                <input class="layui-input" name="dtype" id="dtype" placeholder="请输入字典类型" autocomplete="off">
            </div>
            <input type="button" id="seachTable"
                   class="layui-btn layui-btn-normal" value="搜索"/>
            <button class="layui-btn layui-btn-sm" lay-event="addBtn" style="width:60px;height:38px;line-height:30px">新增</button>
        </div>
    </script>
    <table class="layui-hide" lay-filter="test" id="test"></table>
    <script type="text/html" id="barDemo">
        <a class="layui-btn layui-btn-xs" lay-event="edit" style="width:60px;height:30px;line-height:30px">编辑</a>
        <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del" style="width:60px;height:30px;line-height:30px">删除</a>
    </script>
    <script>
        var table2 = null ;
        layui.use('table', function () {
            var table = layui.table, form = layui.form;

            table2 = table.render({
                elem: '#test'
                , url: '../../dicAction/selectAll'
                ,toolbar: '#toolbarDemo'//开启头部工具栏，并为其绑定左侧模板
                , cellMinWidth: 80 //全局定义常规单元格的最小宽度，layui 2.2.1 新增
                , cols: [[
                    {type: 'checkbox', fixed: 'left'}
                    , {field: 'dcode', width: 110, title: '字典编码', sort: true}
                    , {field: 'dname', width: 110, title: '字典名称', sort: true}
                    , {field: 'dtype', width: 110, title: '字典类型', sort: true}
                    , {fixed: 'right', title: '操作', align: 'center', toolbar: '#barDemo', width: 200}
                ]],
                page: true
            });
            $(function() {
                //查询
                $("#seachTable").on("click",function(){
                    //iframe层
                    console.info("111");
                    table2.reload({
                        where : {
                            dname:$("#dname").val(),
                            dtype:$("#dtype").val(),
                        },
                        page : {
                            curr : 1
                        }
                    });
                });
            });
            //监听行工具事件
            table.on('tool(test)', function(obj){
                var data = obj.data;
                //console.log(obj)
                if(obj.event === 'del'){
                    layer.confirm('真的删除行么', function(index){

                        obj.del();

                        var url="../../dicAction/updateId";
                        var datas={id:data.did};
                        $.post(url,datas,function(obj){
                            if(obj==1){
                                layer.msg('删除成功');

                            }else{
                                layer.msg('删除失败');
                            }
                        },"json");
                    });
                } else if(obj.event === 'edit'){
                    console.info(data.did);
                    layer.msg('编辑操作');
                    layer.open({
                        type: 2,
                        title: '修改页面',
                        shadeClose: true,
                        shade: false,
                        maxmin: true, //开启最大化最小化按钮
                        area: ['893px', '500px'],
                        content: '../../pages/AtsDataDic/DicAddandUpdate.html?id=' + data.did,
                    });
                }
            });
            //监听头部工具栏事件
            table.on('toolbar(test)',function(obj) {
                var checkStatus = table.checkStatus(obj.config.id);
                switch (obj.event) {
                    case 'addBtn'://增加
                        //iframe层
                        layer.open({
                            type : 2,
                            title : '增加页面',//标题
                            shadeClose : true,
                            shade : 0.3,//背景阴影
                            area : [ '893px','500px' ],//大小
                            content : '../../pages/AtsDataDic/DicAddandUpdate.html', //iframe的url
                            end : function() {
                                table2.reload();//渲染
                            }
                        });
                        break;
                }
            });

        });
    </script>
</body>
</html>